<template>
  <!-- 登录后的选项的最上面 ,注意type和align是居中的条件-->
  <van-row class="top" type="flex" align="center" justify="center">
    <!-- 第一个礼物图标 -->
  <van-col span="2" offset="1">
    <van-icon name="bar-chart-o" size="25px" @click="router.push('/life')"    />
  </van-col>
    <!-- 搜索栏图标 -->
  <van-col span="17">
    <van-search v-model="value" placeholder="请输入搜索的水果" background="#BEEDC7" shape="round"/>
  </van-col>
  <!-- 第三个图标 -->
  <van-col span="2">
    <van-icon name="https://fastly.jsdelivr.net/npm/@vant/assets/icon-demo.png"  size="25px" @click="router.push('/mine')" />
  </van-col>
  <!-- 第四个图标 -->
  <van-col span="2">
    <van-icon name="cart-o"  size="25px" @click="router.push('/car')"/>
  </van-col>
</van-row>

 


  <!-- 新鲜水果 -->
  



    <!-- tabbar -->
    <van-tabbar v-model="active" style="z-index: 1;">
  <van-tabbar-item icon="home-o" :to="{path:'/'}">主页</van-tabbar-item>
  <van-tabbar-item icon="search" :to="{path:'/classify/classify1'}">分类</van-tabbar-item>
  <van-tabbar-item icon="browsing-history-o" :to="{path:'/life'}">数据</van-tabbar-item>
  <van-tabbar-item icon="comment-o" :to="{path:'/message'}">消息</van-tabbar-item>
  <van-tabbar-item icon="setting-o" :to="{path:'/car'}">购物车</van-tabbar-item>
  <van-tabbar-item icon="friends-o" :to="{path:'/mine'}">我的</van-tabbar-item>
</van-tabbar>

<!-- tab标签页 -->
<van-tabs v-model="active">
  <!-- 全部的菜单 -->
  <van-tab title="全部" name="a">
    
  </van-tab>

</van-tabs>

  </template>
  
  
  <script setup>
  import { ref } from 'vue';
  import { onMounted } from 'vue';
  import { useCounterStore } from '../../stores/counter'
import router from '@/router';
  const active = ref(0)
  const channel = useCounterStore()




 


  onMounted(() => {
  window.scrollTo(0,0)
})

  </script>
  
  <style scoped>
  .top{
      background-color:#BEEDC7
  }

  .img{
    width: 100%;
    height: 224px;
  }
  .comimg{
    width: 100%;
    height: 224px;
  }
  .wz1{
    font-size: 12px;
    text-align: center;
  }
  .wz2{
    color: red;
    text-align: center;
  }
  .one{
    width: 48%; 
    height: 300px;
    border: 1px solid rgb(206, 206, 206);
    background-color: white;
    float: left;
    margin-left: 1%;
    margin-top: 1%;
    border-radius: 10px;
  }
  .nine{
    width: 55px;
    height: 55px;
    border-radius: 50%;

  }
  .wz3{
    font-size: 15px;
    color:dimgray;
  }
  </style>
  